<template>
	<div id="poCustomerStatus" class="poCustomerStatus">
		<div id="customerSubtitle" class="customerSubtitle">
			<tab>
				<tab-item selected @on-item-click="getPoCustomerCompleteDemoAll" badge-color="#fff" :badge-label="completeDemoNumber">已试听</tab-item>
				<tab-item @on-item-click="getPoCustomerPendingDemoAll" :badge-label="pendingDemoNumber">未试听</tab-item>
			</tab>
		</div>

		<div v-if="page == 'getPoCustomerCompleteDemoAll'">
			<PoCustomerList curURL="ai/pages/getPoCustomerCompleteDemoAll" jumpToObjectDetails="customerDetails"></PoCustomerList>
		</div>
		<div v-else-if="page == 'getPoCustomerPendingDemoAll'">
			<PoCustomerList curURL="ai/pages/getPoCustomerPendingDemoAll" jumpToObjectDetails="customerDetails"></PoCustomerList>
		</div>
	</div>
</template>

<script>
	import bus from '@/event/eventBus'
	import NetWorking from '../../../../utils/networking'
	import PoCustomerList from '../../../../components/mobile/scroller/scrollerPoCustomerList'
	import {Tab, TabItem} from 'vux'
	export default {
		name: "po-customer-status",
		components: {
			Tab,
			TabItem,
			PoCustomerList
		},
		data() {
			return {
				page: 'getPoCustomerCompleteDemoAll',
				completeDemoNumber: '',
				pendingDemoNumber: '',
			}
		},
		created: function () {
			bus.$emit("userDefinedEvent", 2)
			bus.$emit("barController", 1)
			bus.$emit("setTopSimpleTitle", '潜在客户')

			let _this = this
			let url = 'ai/getPoCustomerNumber'

			NetWorking.doGet(
				url,
				null,
				null
			).then(
				response => {
					let rs = response.data

					if(rs.error_code == 0){
						_this.completeDemoNumber = rs.completeNumber + ''
						_this.pendingDemoNumber = rs.pendingNumber + ''
					}else{
						alert(rs.error_message)
					}
				}
			)

		},
		methods: {
			getPoCustomerCompleteDemoAll() {
				this.page = 'getPoCustomerCompleteDemoAll'
			},
			getPoCustomerPendingDemoAll() {
				this.page = 'getPoCustomerPendingDemoAll'
			}
		}
	}
</script>

<style scoped>
	.poCustomerStatus{
		margin-top: 46px;
		margin-bottom: 100px;
	}

	.customerSubtitle {
		margin-top: 46px;
		position: relative;
		z-index: 99;
	}
</style>